{extend name="layout/layout" /}

{block name="pagecss"}

{/block}

{block name="content"}
<div class="row js-check-wrap">
    <div class="col-lg-12">
        <div class="box box-success">
            <div class="box-header with-border">
                <div class="row">
                    <div class="col-md-9">
                        <div class="col-md-3" id="store">
                            {$row.name}-{$row.storeName}
                        </div>
                        <div class="col-md-3" id="form-use">
                            <div class="form-group">
                                <select class="form-control" name="status">
                                    <option value="0">状态</option>
                                    <option value="未使用">未使用</option>
                                    <option value="已使用">已使用</option>
                                    <option value="已过期">已过期</option>
                                </select>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="box-tools pull-right">
                </div>
            </div>
            <div class="box-body">
                <form class="js-ajax-form" method="post">
                    <div class="table-responsive">
                        <table class="table table-striped table-bordered table-hover table-checkable order-column" id="table_coupon_use">
                            <thead>
                            <tr>
                                <th>领取用户</th>
                                <th>手机号</th>
                                <th>领取时间</th>
                                <th>使用状态</th>
                                <th>使用时间</th>
                            </tr>
                            </thead>
                            <tbody>
                            </tbody>
                        </table>
                        <input type="hidden" name="couponId" value="{$row.id}">
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
{/block}

{block name="pagescript"}
<script>
    var index_url = "{:url('admin/coupon/index')}";   //获取代金券列表
    var list_url = "{:url('admin/coupon/indexApi')}";   //获取代金券列表
    var add_url = "{:url('admin/coupon/add')}";  //添加新的代金券
    var edit_url = "{:url('admin/coupon/edit')}";  //编辑
    var del_url = "{:url('admin/coupon/delete')}";  //删除
    var useList_url = "{:url('admin/coupon/useList')}";  //领取及使用记录
</script>
<script src="__STATIC__/admin/js/include.js" type="text/javascript"></script>
<script>
    var useList_api = "{:url('admin/coupon/useListApi')}";  //领取及使用记录
    var table = $('#table_coupon_use');
    var couponId = $("input[name='couponId']").val();
    table.dataTable({
        "processing" : true,
        serverSide : true,// 开启服务器模式
        "ajax" : {
            url : useList_api,  // 列表查询
            data:{'couponId':couponId}
        },
        "autoWidth" : false,
        "columns" : [
            {"width" : "20%","data" : "nickName"},
            {"width" : "10%","data" : "mobile"},
            {
                "width" : "15%",
                "data": "createDate",
                "render" : function(data, type, row, meta) {
                    return timestampToTime(data);
                }
            },
            {
                "width" : "5%",
                "data" : "status",
                "render" : function(data, type, row, meta) {
                    if(data == 0) {
                        var obj = JSON.parse(row.couponDetail);
                        var curTime = Date.parse(new Date())/1000;
                        if(curTime > obj.endTime) {
                            return '已过期';
                        } else {
                            return '未使用';
                        }
                    }
                    else if(data == 1) {
                        return '已使用';
                    } else if(data == 2){
                        return '已占用';
                    } else {
                        return '-';
                    }
                }
            },
            {
                "width" : "15%",
                "data": "updateDate",
                "render" : function(data, type, row, meta) {
                    if( data == null || data.length == 0) {
                        return '';
                    }
                    return timestampToTime(data);
                }
            },
        ],
        "language" : {
            "lengthMenu" : "每页显示 _MENU_ 条记录",
            "emptyTable" : "暂无数据记录",
            "info" : "显示 _START_ 至 _END_ 条数据，共 _TOTAL_ 条记录！",
            "zeroRecords" : "没有搜索到匹配记录",
            "infoEmpty" : "",
            "infoFiltered" : "",
            "processing" : "数据加载中"
        },
        "destroy" : true,
        "pageLength" : 10,
        "order" : [ [ 0, "desc" ] ],
        "columnDefs" : [ {
            "orderable" : false,
            "targets" : [ 0,4]
        } ],
        "dom" : "<'row'<'.col-md-6 col-sm-12'><'col-md-6 col-sm-12'>r>"
        + "<t>" + "<'table_b relative'<'col-md-5'i><'col-md-7'>lp>",
        "fnInitComplete" : function() {
        }
    });

    $('#form-use .form-control').change(function(event){  //根据状态查询用户领取记录
        var status =   $("#form-use select[name='status']").val();
        var param={"status":status};
        $('#table_coupon_use').DataTable().search(JSON.stringify(param)).draw();
    });

    function timestampToTime(timestamp) {
        var date = new Date(timestamp * 1000);
        Y = date.getFullYear() + '-';
        M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-';
        D = date.getDate() + ' ';
        h = checkTime(date.getHours()) + ':';
        m = checkTime(date.getMinutes()) + ':';
        s = checkTime(date.getSeconds());
        return Y+M+D+h+m+s;
    }

    function checkTime(i){  //补足前导0
        if (i<10)
            i="0" + i
        return i
    }
</script>
{/block}